import { color } from "echarts";
import React from "react";
import { CSVLink } from "react-csv";
import { Spin, Icon } from 'antd';
const antIcon = <Icon type="loading" style={{ fontSize: 12, color: '#fff', marginRight: '5px' }} spin />
const ExportCsv = props => {
    // 
    return (
        <div className={props.exportData.parentElName ? props.exportData.parentElName : 'exportCsv'}>
            {
                props.exportData.isLoading ? <div style={{display: 'flex',alignItems: 'center',justifyContent: 'center',color: '#fff'}}><Spin indicator={antIcon} style={{marginRight: '5px'}} spinning={props.exportData.isLoading} /> {props.exportData.dowloadText}</div> :<CSVLink filename={props.exportData.filename + ".csv"} className={props.exportData.elClassName} data={props.exportData.data} headers={props.exportData.headers}>
                <Spin indicator={antIcon} style={{marginRight: '5px', position:'initial'}} spinning={props.exportData.isLoading} />{props.exportData.dowloadText}
            </CSVLink>
            }
            
        </div>
        
    )
}
export default ExportCsv